<template>
<!-- 发布作品 -->
  <div class="home">
    <menuBar></menuBar>
    <div class="content">
        <headPortrait class="headPortrait"></headPortrait>
        <div class="page">
            <img class="cover" src="@/assets/img/writer/item10.png" alt="">
           <div class="text">发布成功等待审核</div>
           <div class="text">审核中可修改或删除  审核成功后不可更改及删除内容</div>
           <div class="btn" @click="router.push({name:'postProduction'})">我知道了</div>
           <img class="icon" src="@/assets/img/writer/item9.png" alt="">
           <div class="text">催一下  加速处理</div>

        </div>
    </div>
  </div>
</template>
<script>
import { getCurrentInstance, onMounted, reactive, } from 'vue'
import { useRouter } from 'vue-router'
import { useStore } from 'vuex'
import menuBar from './component/menuBar'
import headPortrait from './component/headPortrait'
const state = reactive({

  });
export default {
  name: 'waitForReview',
  components: {
    menuBar,
    headPortrait,
  },
  setup(props,{emit}) {
      const ctx = getCurrentInstance();
      const _this = ctx.appContext.config.globalProperties
      const router = useRouter();
      const store = useStore();

      onMounted(()=>{
        // console.log(222);
      });
      return{
        state,router
      }
  },
  data () {
    return {
    }
  },
  props: {},
  watch: {},
  methods: {},
  computed: {},
  mounted () {
  },
}
</script>
<style lang="scss" scoped>
    .home{
      display: flex;
      height: 100vh;
      width: 100vw;
      .content{
        width: 90%;
        position: relative;

        .page{
          position: absolute;
          top: 11%;
          left: 2.5%;
          background-color: #fff;
          height: 85%;
          width: 95%;
          border-radius: 10px;
          display: flex;
          flex-direction: column;
          align-items: center;
          .cover{
            margin-top: 10%;
            width: 421px;
            height: 367px;
            margin-bottom: 10px;
          }
          .text{
            font-size: 20px;
            color: #5790FD;
            &:nth-child(3){
              color: #666666;
              font-size: 16px;
              margin: 15px 0 25px;
            }
            &:nth-child(6){
              margin-top: 10px;
              color: #FE8E4C;
              font-size: 16px;
            }
          }

          .btn{
              width: 148px;
              height: 38px;
              margin: 20px 0;
              background: linear-gradient(90deg, #98B7FF 0%, #4183FD 100%);
              border-radius: 19px;
              color: #fff;
              font-size: 20px;
              display: grid;
              place-items: center;
              cursor: pointer;
          }
          .icon{
              width: 42px;
              height: 42px;
          }

        }
      }
    }
</style>
